import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import './assets/css/base.css'//基础样式
import './assets/css/el-reset.css'  //全局重设eleme-ui的样式

//完整引入
import ElementUI from 'element-ui';//element核心文件
import 'element-ui/lib/theme-chalk/index.css';//element的cs
//引入基于elementui二次封装的一个菜单
import qfSubMenu from 'qf-sub-menu'



Vue.use(ElementUI);//将element注入全部子组件
Vue.use(qfSubMenu)
// Vue.config.productionTip = false;

//全局前置钩子   beforEach

//前置守卫   路由守卫

//判断本地有没有存储token   如果存储了  说明登陆了=>  自由访问页面

//如果没有token => 没登陆  不允许访问login意外的页面

router.beforeEach(function(to,from,next){
  //获取本地存储的token
  let token = localStorage.getItem('yf-token')
  // // //to 是去哪个页面
  // console.log('to==',to);
  // // //from 是从哪个页面来
  // // console.log('from==',from);
  // // //next  放行
  // // next ()
  if(token){
    //登陆之后才可以获取用户的菜单  在这里获取菜单的目的就是为了刷新页面或者进入页面的时候数据丢失的问题
    //判断vuex中sideMenu是否有长度 没有就重新获取
    if(!store.state.sideMenu.length){
      store.dispatch('FETCH_MENULIST')
      .then(()=>{
        next({path:to.path})
      })
    }else{
      next()
    }
  }else{
    //没有token的时候   没有登陆   只让访问登陆页
    //判断访问的是不是登陆页

    if(to.path==='/login'){
      //访问的是login   放行
      next() 
    }else{
      //访问的不是login  重新跳转到登录页
      next({path:'/login'})
    }
  }
})

new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
